<template>
  <div>
      <div class="container">
        <MusicItem
          v-for="val of dif"
          :key="val.id"
          :item="val"
        ></MusicItem>
      </div>
  </div>
</template>

<script>
import HomeHttp from '../../model/HomeHttp';
import MusicItem from "../../components/music/MusicItem.vue";

export default {
  data() {
    return {
      dif:[]
    }
  },
  components:{
    MusicItem
  },
  async activated(){
  var {title} = this.$route.query;
   var fn = this.handleQuery(title);
   var res = await HomeHttp[fn]();
   console.log(res);
   var {playlists,albums,result} = res.data;
   if(playlists){
     this.dif = playlists
   }else if(albums){
     this.dif = albums
   }else if(result){
     this.dif = result
   }
  },
  methods: {
    handleQuery(title){
      if(title=="hots"){
        return "getHotMusic"
      }else if(title=="news"){
        return "getNewMusic"
      }else if(title=="djs"){
        return "getDjMusic"
      }
    }
  },
}
</script>

<style>

</style>